// components/mask/mask.js
const windowHeight = wx.getSystemInfoSync().windowHeight;

Component({
  /**
   * 组件的属性列表
   */
  properties: {
    toggle: {
      type: Boolean,
      value: false,
      observer (v) {
        // 父组件toggle控制遮罩层显示隐藏
        if (v) {
          this._open();
        } else {
          this._close();
        }
      }
    }
  },

  /**
   * 组件的初始数据
   */
  data: {
    show: false,
    animationData: {}
  },

  /**
   * 组件的方法列表
   */
  methods: {
    // 组件内部打开遮罩方法
    _open () {
      const that = this;
      const animate = wx.createAnimation({
        duration: 300,
        timingFunction: "ease",
        delay: 0
      })
      animate.opacity(0).step();
      that.setData({
        animationData: animate.export(),
        show: true
      })
      setTimeout(() => {
        animate.opacity(1).step();
        that.setData({
          animationData: animate.export()
        })
      }, 50)
    },

    // 组件内部关闭遮罩方法
    _close () {
      const that = this;
      const animate = wx.createAnimation({
        duration: 300,
        timingFunction: "ease",
        delay: 0
      })
      animate.opacity(0).step();
      that.setData({
        animationData: animate.export()
      })
      setTimeout(() => {
        that.setData({
          show: false
        })
      }, 300)
    },

    // 关闭时需要派发事件关闭
    close () {
      this.triggerEvent('close')
    }

  }
})
